<template>
    <view class="w100 ">
		<view class="w100 text-center">
			<image src="../../static/image/logot.png" style="width: 350upx;" mode="aspectFit"></image>			
		</view>
		<view class="w100" style="font-size: 12pt; margin-top: -20upx;">
			<!-- <view class="w100 u-p-40" style="padding-top: 0px; font-size: 14pt; font-weight: bold;text-align: center;">
				使用密码登录
			</view> -->
			<view class="bg-white u-m-60">
				<u-form-item class="u-p-40" label="账号" prop="name">
					<u-input v-model="form.username" placeholder-style='fontSize:36upx' placeholder="请输入账号" />
				</u-form-item>
				<u-form-item class="u-p-40 u-font-40" label="密码" prop="name">
					<u-input type="password" v-model="form.password" placeholder-style='fontSize:36upx' placeholder="请输入密码"/>
				</u-form-item>
			</view>
			<view class="u-flex u-m-60">
				<u-button class="u-light-color" :type="form.username&&(form.password.length>5)?'primary':''" shape="circle" size="medium" @click="bindLogin()" style="font-size: 36upx;width: 90%;padding: 30upx;">登录</u-button>
			</view>
		</view>
    </view>
</template>

<script>
    export default {
        data() {			
            return {
				form:{
					username:'',
					password:'',
				}
            }
        },
		onShow() {
		},
		onLoad() {
		},
        methods: {
            bindLogin() {
                /**
                 * 客户端对账号信息进行一些必要的校验。
                 * 实际开发中，根据业务需要进行处理，这里仅做示例。
                 */
				if (this.form.account=='') {
                    uni.showToast({
                        icon: 'none',
                        title: '请输入账号'
                    });
                    return;
                }
                if (this.form.password.length < 6) {
                    uni.showToast({
                        icon: 'none',
                        title: '密码最短为 6 个字符'
                    });
                    return;
                }
				this.$u.api.usernameLogin(this.form).then(res=>{
					uni.setStorageSync('userinfo',res.data);
					uni.setStorageSync('token',res.data.token);
					uni.showToast({
					    icon: 'success',
					    title: '登陆成功'
					});
					setTimeout(res=>{
						uni.switchTab({
							url: "/pages/home/index"
						})
					},1000)
				}).catch(res=>{
					uni.showToast({
					    icon: 'success',
					    title: '登陆失败'
					});
				});
            }
        }
    }
</script>
<style>
	page{
		background-color: #fff;
	}
	.u-hairline-border:after{
		border:0 !important
	}
</style>
